// = Sidebar Menu
// ============================================================================
.o_web_client_theme_colore_0 {
    $color: #e6edf5;
    $-sidebar-bg-start-color: adjust-color($color, $lightness: -5%, $saturation: -5%);
    $-sidebar-bg-end-color: adjust-color($color, $lightness: 15%, $saturation: 0%);

    // 默认最小化，最大化时，背景渐变
    .o_sidebar_menu.sidebar-maximize {
        background: linear-gradient(135deg, $-sidebar-bg-start-color 0%, $-sidebar-bg-end-color 100%) !important;
    }
}

@for $size from 1 through length($o-theme-colors) {
    $color: nth($o-theme-colors, $size);

    .o_web_client_theme_colore_#{$size} {
        $-sidebar-bg-start-color: adjust-color($color, $lightness: -5%, $saturation: -5%);
        $-sidebar-bg-end-color: adjust-color($color, $lightness: 15%, $saturation: 0%);

        .o_sidebar_menu {
            .o_sidebar_menu_brand {
                .o_sidebar_menu_toggler {
                    color: #ffffff !important;
                }
            }

            .o_sidebar_menu_accordion_button_app,
            .o_sidebar_menu_accordion_button_menu {
                // color: #ffffff !important;
                color: darken($o-white, 10%) !important;

                // 修改箭头颜色
                &.accordion-button::after {
                    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
                }

                &.accordion-button:not(.collapsed)::after {
                    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
                }

                &.active,
                &:hover {
                    color: #ffffff !important;
                }
            }
        }

        // 默认最小化，最大化时，背景渐变
        .o_sidebar_menu.sidebar-maximize {
            background: linear-gradient(135deg, $-sidebar-bg-start-color 0%, $-sidebar-bg-end-color 100%) !important;
        }
    }

}

.o_sidebar_menu {
    // top: $o-navbar-height;
    position: absolute;
    display: flex;
    flex-direction: column;
    height: 100vh;
    max-width: $o-sidebar-menu-width ;
    min-width: $o-sidebar-menu-collapse-width;
    background-color: transparent !important;

    &.sidebar-maximize {
        transition: all 0.3s;
    }

    .accordion-item {
        background-color: transparent !important;
        border: 0;
    }

    .o_sidebar_menu_brand {
        @include print-variable(o-side-navbar-brand-height, $o-side-navbar-brand-height);

        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative;
        flex: 0 0 auto;
        height: $o-side-navbar-brand-height;

        .o_sidebar_menu_brand_inner_wrapper {
            height: $o-side-navbar-brand-height;

            .brand-logo {
                display: flex;
                justify-content: center;
                margin-right: 0;
            }

            img {
                max-width: 190px !important;
                max-height: calc(var(--o-side-navbar-brand-height) - 4px);
            }

            .o_sidebar_menu_toggler {
                min-width: 32px;

                &:focus {
                    box-shadow: none;
                }
            }
        }
    }

    .accordion-button:not(.collapsed) {
        box-shadow: none !important;
    }

    .o_sidebar_menu_accordion {
        padding: 0;
        overflow-y: auto;
        background-color: transparent !important;

        &::-webkit-scrollbar {
            width: 5px !important;
        }


        .o_sidebar_menu_accordion_item {
            background-color: transparent !important;

            .o_sidebar_menu_accordion_item_app {
                background-color: transparent !important;

                .accordion-header {
                    background-color: transparent !important;

                    .o_sidebar_menu_accordion_button_app {
                        background-color: transparent !important;
                        line-height: 1.8rem;
                        padding: 0.5rem;
                        display: flex;
                        align-items: center;
                        font-size: 1rem;

                        &:not(.collapsed) {
                            background-color: transparent;
                            box-shadow: none;
                        }

                        &.active,
                        &.active:hover {
                            color: $o-side-navbar-app-item-entry-active-color;
                            // background-color: $o-side-navbar-app-item-entry-active-bg;
                            background-color: transparent;
                            border-left: none;

                            .menu-badge {
                                background-color: $o-danger;
                            }
                        }

                        &:hover {
                            border-left: 2px solid $o-side-navbar-item-hover-border;
                            // background-color: $o-side-navbar-item-hover-bg;
                            background-color: transparent;
                        }

                        img.menu-icon {
                            height: 24px;
                            width: 24px;
                            margin-right: 0.5rem;
                        }

                        .menu-badge {
                            // margin-right: -0.5em;
                            border: 0;
                            color: $o-white;
                            padding: ($o-side-navbar-menu-item-padding * 0.5) $o-side-navbar-menu-item-padding;
                            // background-color: var(--o-side-navbar-menu-item-badge-bg,
                            //     #{$o-side-navbar-menu-item-badge-bg});
                            background-color: transparent;
                            font-size: $o-side-navbar-menu-item-badge-size;
                            text-shadow: 1px 1px 0 rgba(#000, 0.3);
                        }

                        &.no_submenus,
                        &.no_arrow {
                            background-color: transparent;
                            box-shadow: none;

                            &::after {
                                display: none;
                                // background-image: none;
                            }
                        }
                    }
                }

                .accordion-collapse {
                    .accordion-body {
                        padding: 0.1rem 0 0.1rem 1rem;

                        .accordion {
                            background-color: transparent !important;

                            .accordion-header {
                                background-color: transparent !important;

                                .o_sidebar_menu_accordion_button_menu {
                                    background-color: transparent !important;
                                    line-height: 1.8rem;
                                    padding: 0.5rem;
                                    display: flex;
                                    align-items: center;
                                    font-size: 1rem;


                                    &.active,
                                    &.active:hover {
                                        font-weight: 700;
                                        // border-left: 2px solid $o-side-navbar-menu-item-active-color;
                                        color: $o-side-navbar-menu-item-entry-active-color;
                                        // background-color: $o-side-navbar-menu-item-entry-active-bg;
                                        background-color: $o-side-navbar-item-entry-active-bg !important;
                                        // background-color:transparent;
                                    }

                                    &:hover {
                                        // border-left: 2px solid $o-side-navbar-item-hover-border;
                                        // background-color: $o-side-navbar-item-hover-bg ;
                                        background-color: $o-side-navbar-item-entry-active-bg !important;
                                        // background-color:transparent;
                                    }

                                    .menu-icon {
                                        height: 24px;
                                        width: 12px;
                                        margin-right: 0.5rem;

                                        display: flex;
                                        justify-content: center;
                                        align-items: center;
                                    }

                                    .menu-label {
                                        // width: 150px;
                                        text-align: left;
                                    }

                                    .menu-badge {
                                        // margin-right: -0.5em;
                                        border: 0;
                                        color: $o-white;
                                        padding: ($o-side-navbar-menu-item-padding * 0.5) $o-side-navbar-menu-item-padding;
                                        // background-color: var(--o-side-navbar-menu-item-badge-bg,
                                        //     #{$o-side-navbar-menu-item-badge-bg});
                                        background-color: transparent;
                                        font-size: $o-side-navbar-menu-item-badge-size;
                                        text-shadow: 1px 1px 0 rgba(#000, 0.3);
                                    }

                                    &.no_submenus,
                                    &.no_arrow {
                                        &::after {
                                            display: none;
                                            // background-image: none;
                                        }
                                    }
                                }
                            }
                        }


                    }
                }
            }
        }
    }
}